// 从redux导入dispatch的数据类型
import { AnyAction } from 'redux'

import { SET_MENUS, PATH_CHANGE, ADD_TAGS, REMOVE_TAGS } from './actionNames'
import { KeyPaths, Tags, Tag, MainMenus, Breads } from '@/types/global'

interface IState {
  menus: MainMenus
  keyPaths: KeyPaths
  breads: Breads
  tags: Tags
}

const defaultValue: IState = {
  menus: [],
  keyPaths: [],
  breads: [],
  tags: [],
}

/**
 * 创建一个派发login的action方法
 * @param options 登陆系统所需要的信息
 * @returns
 */
export function setPageChange(options: KeyPaths) {
  return {
    type: PATH_CHANGE,
    payload: options,
  }
}

export function addTags(options: Tag) {
  return {
    type: ADD_TAGS,
    payload: options,
  }
}
export function removeTags(options: Tag) {
  return {
    type: REMOVE_TAGS,
    payload: options,
  }
}

let tags: Tags
let index: number
// 能被reducer函数接收到，代表着这个action已经是一个符合redux规则的action了
export function layoutInfo(state = defaultValue, { type, payload }: AnyAction) {
  switch (type) {
    case SET_MENUS:
      return { ...state, menus: payload }
    case PATH_CHANGE:
      // 获取面包屑
      const breads = getBread(state.menus, [...payload])
      // 获取tags
      tags = getTags([...state.tags], [...breads].reverse()[0])
      // return { ...state }
      return { ...state, keyPaths: payload, breads, tags }
    case ADD_TAGS:
      console.log(state, state.tags, payload)
      tags = getTags([...state.tags], payload)
      return { ...state, tags }
    // return { ...state, tags: [...state.tags, payload] }
    case REMOVE_TAGS:
      // tags = [...state.tags]
      // // 寻找被选中的tag
      // const checked = tags.findIndex(item => item.checked)
      // // 寻找到对应的tag
      // index = tags.findIndex(item => item.path === payload.path)
      // // 清除对应的tag
      // tags.splice(index, 1)
      // // 如果当前被删除的是被选中的
      // if (checked === index) {
      //   if (index === 0) {
      //     tags[0].checked = true
      //   } else {
      //     tags[index - 1].checked = true
      //   }
      // }
      return { ...state }
    default:
      return state
  }
}

const getTags = function (tags: Tags, tag: Tag) {
  if (!tags.length || !tag) {
    return tags
  }
  // 检查当前数组中是否已经存在
  index = tags.length ? tags.findIndex(item => item.path === tag.path) : -1
  // 清除掉所有的选中状态
  tags.map(item => {
    item.checked = false
    return item
  })
  // 赋予选中状态
  if (index < 0) {
    tag.checked = true
    tags.push(tag)
  } else {
    tags[index].checked = true
  }
  return tags
}

const getBread = function (
  list: MainMenus,
  keyPaths: KeyPaths,
  breadList: Breads = []
) {
  // 因为select方法中获取到的keyPath是倒序，所以我们每次取出最后一个做为它的父级节点
  const currentPath = keyPaths.shift()
  for (const item of list) {
    if (item.path === currentPath) {
      const { path, title, icon } = item
      // 将当前的title加入到面包屑数组
      breadList.push({
        path,
        title,
        icon,
      })

      // 如果还有下级选中项
      if (list.length && item.children) {
        // 将获取到的数组加入到当前数组\
        // concat不会改变原数组，它会返回一个新数组
        breadList = breadList.concat(getBread(item.children, keyPaths))
      }
      // 与getOpenKeys不一样的是，这里只要拿了匹配的数据就表示子列表肯定就是当前的item.children，所以就不需要再继续遍历，直接结束当前循环
      break
    }
  }

  return breadList
}
